<template>
	<view v-if="display" class="tui-cards-container">
		<view class="tui-cards-box">
			<view class="tui-cards-title">
				<view>请选择你要发送的订单</view>
				<view style="color: #006EFF; font-family: PingFangSC-Regular;" class="tui-cards-close" @tap="handleClose">关闭</view>
			</view>
			
			<scroll-view class="tui-order-list" scroll-y="true" enable-flex="true">
				<view class="w-full u-p-30">
					<view v-for="(item, index) in orderMatch" :key="index" class="tui-order-item">
						
						<view class="order-info">
					    <view class="order-content">
								<view class="u-flex u-flex-row u-row-between u-m-b-30 u-col-center">
									<view class="order-content-title">{{ item.acceptanceServiceTypeName }}</view>
									<view class="u-font-26" style="color: #1D6AFF;">
										<text>{{item.originalOrdersType}}</text>
									</view>
								</view>
								
								<view class="order-content-description">订单编号:{{ item.ordersNumber }}</view>
								<view class="order-content-description">创建时间:{{ item.ordersTime }}</view>
								<view style="display: flex; flex-wrap: no-wrap; justify-content:flex-end">
								
									<view class="btn-send-order" :data-order="item" @tap.stop="sendMessage"><text class="btn-send-text">发送此订单</text></view>
								</view>
							</view>
						</view>
					</view>
				</view>
		
			</scroll-view>
		</view>
	</view>
</template>

<script>


export default {
	data() {
		return {
			
		
		};
	},

	components: {},
	props: {
		display: {
			type: Boolean,
			default: false
		},
		conversation: {
			type: Object,
			default: () => {}
		},
		orderMatch: {
			type: Array,
			default: () => []
		}
	},
	watch: {
		display: {
			handler: function(newVal) {
				// this.setData({
				//   display: newVal
				// });
			},
			immediate: true
		},
		conversation: {
			handler: function(newVal) {
				this.setData({
					conversation: newVal
				});
			},
			immediate: true,
			deep: true
		}
	},
	mounted() {
	  console.log(this.orderMatch);	
	},
	methods: {
		handleClose() {
			this.$emit('close', {
				detail: {
					key: '1'
				}
			});
		},


		sendMessage(e) {
			const { order } = e.currentTarget.dataset;
			console.log('order');
			console.log(order);
			this.$emit('sendCustomMessage', {
				detail: {
					payload: {
						// data 字段作为表示，可以自定义
						data: 'order',
						description: order.description,
						// 获取骰子点数
						extension: JSON.stringify({
							acceptanceServiceTypeName: order.acceptanceServiceTypeName,
							ordersNumber: order.ordersNumber,
							originalOrdersType: order.originalOrdersType,
							ordersTime:order.ordersTime
						})
					}
				}
			});
		}
	}
};
</script>
<style>
@import './index.css';
</style>
